<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>创建网点拜访任务</title>

    <link rel="shortcut icon" href="__STATIC__/layout/favicon.ico">
    <link href="__STATIC__/layout/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="__STATIC__/layout/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="__STATIC__/layout/css/animate.css" rel="stylesheet">
    <link href="__STATIC__/layout/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="__STATIC__/layout/css/channel.css?v=4.1.0" rel="stylesheet">
    <!-- Sweet Alert -->
    <link href="__STATIC__/layout/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">

    <link rel="stylesheet" href="__STATIC__/layout/css/demo.css" type="text/css">
    <link href="__STATIC__/layout/css/gyq.css" rel="stylesheet">
    <style>

    </style>

</head>

<body class="white-bg" style="padding: 3px;">
<div class="page-heade">
    <h2 class="title_color text-center">创建网点拜访任务</h2>
</div>
<form action="" class="form-inline" id="form1">
    <table class="table table-bordered bud_hei">
        <tr>
            <td class="text-center">
                日期：从
                <div class="form-group">
                    <input type="text" id="start" class="form-control layer-date "
                           style="min-width:120px;width:120px;display: inline-block;" name="">
                </div>
                <div class="form-group">
                    至
                </div>
                <div class="form-group">
                    <input type="text" class="form-control layer-date"
                           style="min-width:120px;width:120px;display: inline-block;" id="end" name="">
                </div>
                <div class="form-group" style="display: none;" id="bfry_div">
                    <div style="float:left;">
                        拜访人员：
                    </div>
                    <div style="float:left;">
                        <div class="form-group" id="bfry_input">
                            <div class="input-group">
                                <input id="xgry" type="text" placeholder="请输入关键字或空格查询"
                                       class="form-control" value="" style="min-width: 300px;width: 300px">
                                <div class="input-group-btn">
                                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div id="bfry_queding" class="selectedOnlyOne" style="display: none;">
                            <input type="hidden" name="bfry" >
                            <span class="inin"></span>
                            <span class="close">×</span>
                        </div>
                    </div>
                    <a href="javascript:;" id="select_xgry" class="btn btn-primary btn-sm" style="float:left;">选择</a>
                </div>
            </td>
        </tr>
        <tr>
            <td>温馨提示：1、可在“拜访线路”选择某一线路，系统会在需拜访的网点带出预设好的网点。；2、可在需拜访的网点列增加或删除需拜访的网点。3.业务员最终网点拜访任务的网点列显示的为准。</td>
        </tr>
        <tr>
            <td id="fzdbfxl">

            </td>
        </tr>
    </table>
</form>
<table class="table table-striped table-bordered table-hover bud_hei text-center" style="width: 100%;">
    <thead>
        <tr class="info">
            <td>拜访时间</td>
            <td>拜访线路</td>
            <td>需拜访的网点</td>
        </tr>
    </thead>
    <tbody id="liebiao">

    </tbody>
</table>
<div class="padding-10 text-center">
    <button class="btn btn-success" type="button" id="xfbfrw">下发拜访任务</button>
    <span class="lr_5"></span>
    <button class="btn btn-warning" type="button" onclick="back()">返回</button>
</div>

<!--  <h5 class="text-center"  style="font-size: 13px;font-weight: 500">
                 总共有12条记录，第1/2页,当前页<input id="page" type="text"  style="width: 40px" value="1"/><span id="gopage">Go</span>&nbsp;&nbsp;<span id="fistpage">首页</span>&nbsp;&nbsp;
                 每页显示
                 <select id="pagesize">
                     <option value='10' selected>10条</option>
                     <option value='15'>15条</option>
                     <option value='20'>20条</option>

                 </select>
             </h5> -->
<!--    <h3 class="text-center"><img src="__STATIC__/layout/img/zwsj.png"></h3> -->

<!-- 全局js -->
<script src="__STATIC__/layout/js/jquery.min.js"></script>
<script src="__STATIC__/layout/js/contabs_sub.js"></script>
<script src="__STATIC__/layout/js/bootstrap.min.js?v=3.3.6"></script>
<!-- Sweet alert -->
<script src="__STATIC__/layout/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="__STATIC__/layout/js/plugins/layer/laydate/laydate.js"></script>
<script src="__STATIC__/layout/js/contabs_sub.js"></script>
<script src="__STATIC__/layout/js/plugins/suggest/bootstrap-suggest.min.js"></script>
<script>
    $(function () {
        //下发拜访任务
        $('#xfbfrw').on('click',function () {
            var bfry = $('[name=bfry]').val()
            var li = []
            $('#liebiao tr').each(function (i,o) {
                var bfrq = $(o).find('[name=bfrq]').val()
                var bfxl = $(o).find('[name=bfxl]').val()
                var net = ''
                var net2 = []
                $(o).find('[name=net]').each(function (ii,oo) {
                    net2.push($(oo).val())
                })
                net = net2.join('-')
                li.push({
                    bfrq:bfrq,
                    bfxl:bfxl,
                    net:$(o).find('[name=net]').val(),
                })
            })
            $.post('',{bfry:bfry,li:li},function (data) {
                    swal({title:data.msg},function () {
                        history.go(-1)
                    })
            },'json')
        })
        //弹出选择相关人员
        $('#select_xgry').on('click',function () {
            var _this = this
            var index = layer.getFrameIndex(window.name)
            layer.open({
                type:2,
                area:['60%','60%'],
                maxmin:true,
                btn:'确定',
                btnAlign:'c',
                content:'{:url("open/employee2")}',
                yes:function (i,o) {
                    var a = $(o).find('iframe').contents()

                    var id =  a.find("#renyuan").val();
                    var name =  a.find("#renyuanname").val();
                    if(id){
                        var jxs_queding = $('#bfry_queding')
                        var jxs_input = $('#bfry_input')

                        jxs_queding.find('.inin').html(name)
                        jxs_queding.find('.inin').data('id',id)
                        jxs_queding.show()
                        jxs_queding.find('input').val(id)
                        jxs_input.hide()
                    }
                    layer.close(i)
                }
            })
            return  false
        })

        //删除单个选定
        $('body').on('click','.duoxuan .close',function () {

            $(this).closest('.ren').remove()
        })

        //相关人员
        $("#xgry").bsSuggest({
            url:"{:url('Bs/employee')}",
            effectiveFields: ["id", "title"],
            searchFields: [ "title"],
            effectiveFieldsAlias: {title: "名称"},
            ignorecase: true,
            showHeader: true,
            showBtn: false,     //不显示下拉按钮
            delayUntilKeyup: true, //获取数据的方式为 firstByUrl 时，延迟到有输入/获取到焦点时才请求数据
            idField: "id",
            keyField: "title",
            clearable: true
        }).on('onDataRequestSuccess', function (e, result) {
            console.log('onDataRequestSuccess: ', result);
        }).on('onSetSelectValue', function (e, keyword, data) {
            $(this).val('')
            $('#bfry_queding').find('.inin').html(keyword.key)
            $('#bfry_queding').find('input').val(keyword.id)
            $('#bfry_queding').show()
            $('#bfry_input').hide()
            var start = $('#start').val()
            var end = $('#end').val()
            $.post('{:url("fzdbfxl")}',{id:keyword.id,start:start,end:end},function (data) {
                $('#fzdbfxl').html(data.data1)
                $('#liebiao').html(data.data2)
                //拜访线路
                $(".bfxl").bsSuggest({
                    url:"{:url('bswdxl')}?id="+keyword.id,
                    effectiveFields: ["id", "title"],
                    searchFields: [ "title"],
                    effectiveFieldsAlias: {title: "名称"},
                    ignorecase: true,
                    showHeader: true,
                    showBtn: false,     //不显示下拉按钮
                    delayUntilKeyup: true, //获取数据的方式为 firstByUrl 时，延迟到有输入/获取到焦点时才请求数据
                    idField: "id",
                    keyField: "title",
                    clearable: true
                }).on('onDataRequestSuccess', function (e, result) {
                    console.log('onDataRequestSuccess: ', result);
                }).on('onSetSelectValue', function (e, keyword, data) {
                    $(this).val('')
                    $(this).closest('td').find('.inin').html(keyword.key)
                    $(this).closest('td').find('.selectedOnlyOne input').val(keyword.id)
                    $(this).closest('td').find('.selectedOnlyOne').show()
                    $(this).closest('.form-group').hide()
                    var _this = this
                    $.post('{:url("gjxlcwd")}',{id:keyword.id},function (data2) {
                        $(_this).closest('td').next('td').html('<div style="float:left;">\n' +
                            '                        <div class="form-group" id="bfry_input">\n' +
                            '                            <div class="input-group">\n' +
                            '                                <input type="text" placeholder="请输入关键字或空格查询"\n' +
                            '                                       class="net form-control" value="" style="min-width: 300px;width: 300px">\n' +
                            '                                <div class="input-group-btn">\n' +
                            '                                    <ul class="dropdown-menu dropdown-menu-right" role="menu">\n' +
                            '                                    </ul>\n' +
                            '                                </div>\n' +
                            '                            </div>\n' +
                            '                        </div>\n' +
                            '                    </div>\n' +
                            '                    <a href="javascript:;" class="select_net btn btn-primary btn-sm" style="float:left;">选择</a><div class="duoxuan" style="clear:both;">'+data2+'</div>')

                        $(_this).closest('td').next('td').find('.net').bsSuggest({
                            url:"{:url('bsnetbyxl')}"+'?id='+keyword.id,
                            effectiveFields: ["id", "title"],
                            searchFields: [ "title"],
                            effectiveFieldsAlias: {title: "名称"},
                            ignorecase: true,
                            showHeader: true,
                            showBtn: false,     //不显示下拉按钮
                            delayUntilKeyup: true, //获取数据的方式为 firstByUrl 时，延迟到有输入/获取到焦点时才请求数据
                            idField: "id",
                            keyField: "title",
                            clearable: true
                        }).on('onDataRequestSuccess', function (e, result) {
                            console.log('onDataRequestSuccess: ', result);
                        }).on('onSetSelectValue', function (e, keyword, data) {
                            $(this).val('')
                            var bool = false
                            $(this).closest('td').find('.duoxuan .ren').each(function (idx,o) {
                                if($(this).data('id') == keyword.id){
                                    bool = true;
                                }
                            })
                            if(bool == false){
                                $(this).closest('td').find('.duoxuan').append('<span class="ren" data-id="'+keyword.id+'">'+keyword.key+'<input type="hidden" name="net[]" value="' + data[j].id + '"><span class="close">×</span></span>')
                            }
                        }).on('onUnsetSelectValue', function () {
                            console.log("onUnsetSelectValue");
                        });

                        //弹出选择相关人员
                        $(_this).closest('td').next('td').find('.select_net').on('click',function () {
                            var _this = this
                            var index = layer.getFrameIndex(window.name)
                            layer.open({
                                type:2,
                                area:['60%','60%'],
                                maxmin:true,
                                btn:'确定',
                                btnAlign:'c',
                                content:'{:url("net")}?id='+keyword.id,
                                yes:function (i,o) {
                                    var a = $(o).find('iframe').contents()
                                    var data = a.find('#data')
                                    data = data.val()
                                    data = JSON.parse(data)
                                    var bool = false
                                    for(var j=0;j<data.length;j++){
                                        $(_this).closest('tr').find('.duoxuan .ren').each(function (idx, o) {
                                            if ($(this).data('id') == data[j].id) {
                                                bool = true;
                                            }
                                        })
                                        if (bool == false)
                                            $(_this).closest('tr').find('.duoxuan').append('<span class="ren" data-id="' + data[j].id + '">' + data[j].title + '<input type="hidden" name="net[]" value="' + data[j].id + '"><span class="close">×</span></span>')
                                    }
                                    layer.close(i)
                                }
                            })
                            return  false
                        })
                    })


                    //console.log('onSetSelectValue: ', keyword, data);
                }).on('onUnsetSelectValue', function () {
                    console.log("onUnsetSelectValue");
                });
            },'json')
            //console.log('onSetSelectValue: ', keyword, data);
        }).on('onUnsetSelectValue', function () {
            console.log("onUnsetSelectValue");
        });

        $('body').on('click','.selectedOnlyOne .close',function () {
            $(this).closest('.selectedOnlyOne').find('input').val('')
            $(this).closest('.selectedOnlyOne').hide()
            $(this).closest('td').find('.form-group').show()
        })

    })

    function back() {
        history.go(-1)
    }
</script>
<script src="__STATIC__/layout/js/plugins/layer/layer.min.js"></script>
<script>
    //日期范围限制
    var start = {
        elem: '#start',
        format: 'YYYY/MM/DD',
        min: laydate.now(), //设定最小日期为当前日期
        max: '2099-06-16 23:59:59', //最大日期
        istime: true,
        istoday: false,
        choose: function (datas) {
            end.min = datas; //开始日选好后，重置结束日的最小日期
            end.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end = {
        elem: '#end',
        format: 'YYYY/MM/DD',
        min: laydate.now(),
        max: '2099-06-16 23:59:59',
        istime: true,
        istoday: false,
        choose: function (datas) {
            start.max = datas; //结束日选好后，重置开始日的最大日期
            $('#bfry_div').show()
        }
    };
    laydate(start);
    laydate(end);
    $(document).ready(function () {
        $('#reset').on('click', function () {
            $("#form1 input").each(function () {
                $(this).val('');
            });
            $("#form1 select").each(function () {
                $(this).val('');
            });
            $('#form1').submit()
            return false
        })
    })

</script>
</body>

</html>